<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/main.min.css">
    <title>SASS</title>
</head>
<body>
    <div class="filter">
        <header class="header">
            <div class="logo">
                <img src="./img/kisspng-computer-icons-newspaper-coingeto-cryptocurrency-smooth-bending-technology-background-png-free-down-5aee94e3657031.6769822515255851234155.png" alt="Logo">
                <div class="logoText">
                    <p class="firstP">Itproger</p>
                    <p class="secondP">Blog</p> 
                </div>
                
            </div>
            <input type="search" name="search" id="search" placeholder="Поиск">
            <button class="closeInput">X</button>
            <div class="allBtn">
                <div class="btn reg">Главная</div>
                <div class="btn reg">Войти</div>
                <div class="btn reg">Контакты</div>
            </div>

        </header>
        <div class="main">
            <div class="mainInfo">
                <h2>3 основные сферы применения языка Python</h2>
                <p>До начала активного изучения любого языка программирования правильно было бы задуматься о сферах его применения. Мы расскажем про 3 самые популярные сферы применения языка Python.</p>
                <div class="mainInfoBtn">Читать далее</div>
            </div>
            <div class="mainImg">
                <img class="imgSmart" src="./img/sdfsdfsd.png" alt="mozilla">
            </div>
        </div>
        <div class="news">
            <div class="mainNews">
                <h2>Новости</h2>
                <div class="mainNewsContainer">
                    <div class="containerMedia">
                        <div class="imgHolder"></div>
                        <h3>Сравнение движков: Unreal Engine 4 против Unity 5</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="containerMedia">
                        <div class="imgHolder"></div>
                        <h3>Сравнение движков: Unreal Engine 4 против Unity 5</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="divHidden containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="divHidden containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="divHidden containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                    <div class="divHidden containerMedia">
                        <div class="imgHolder"></div>
                        <h3>7 девушек айтишниц из фильмов и сериалов</h3>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                        <div class="newsBtn">Читать далее</div>
                    </div>
                </div>
                <button class="loadBtn">Подгрузить больше</button>
            </div>
            <div class="aside">
                <h2>Анонсы</h2>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus commodi ipsa dolorem vel? Minima, deleniti!</p>
                <div>
                    <br>
                    <div class="imgHolder"></div>
                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium explicabo provident impedit eum vitae quis, dolor, inventore voluptatibus delectus quibusdam iure! Nulla autem fuga ipsum.</p>
                    <div class="newsBtnTwo">Читать далее</div>
                </div>
            </div>
        </div>
        <footer class="footer">
            <p>Все права защищены. &copy;</p>
        </footer>
    </div>
    <script src="./js/script.js"></script>
</body>
</html>